<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本用例</title>
    <style>
        table{border-collapse: collapse;}
        td{border: 1px solid #000;}
    </style>
</head>
<body>
    <div id="wp"></div>
    <script id="tpl" type="text/html">
    <table>
        <caption>for循环输出两次</caption>
        <%var test = '输出自定义变量';%>
        <%for (var i = 0; i < 2; i++) {%>
            <tr><td>&lt;%=html%&gt;默认</td><td><%=html%></td></tr>
            <tr><td>&lt;%:h=html&gt;html转义</td><td><%:h=html%></td></tr>
            <tr><td>&lt;%:=html&gt;不转义</td><td><%:=html%></td></tr>
            <tr><td>&lt;%:u=url&gt;URI转义</td><td><%:u=url%></td></tr>
            <tr><td>var</td><td><%:=test%></td></tr>
            <tr><td>&lt;%=test + 1&gt;表达式</td><td><%=test + 1%></td></tr>
            <%if (true) {%>
                <tr><td>if</td><td>if 语句</td></tr>
            <%}%>
            <tr><td>分割线</td><td>------------------------------</td></tr>
        <%}%>
    </table>
    </script>
    <script src="../dist/index.aio.js"></script>
    <script>
    var html = template(document.getElementById('tpl').innerHTML, {
        url: 'http://yanhaijing.com?name=颜海镜', 
        html: '<div id="test">template.js "</div>'
    });

    console.log(html);
    document.getElementById('wp').innerHTML = html;
    </script>
</body>
</html>
